// 引入
const id = window.localStorage.getItem('id')
loginTest()

function loginTest() {
    const token = window.localStorage.getItem('token')
    const on = document.querySelector('.on')
    const off = document.querySelector('.off')
    if (!id || !token) return
    ajax({
        url: 'http://localhost:8888/users/info',
        data: `id=${id}`,
        token: token,
        dataType: 'json',
        success(res) {
            if (res.code === 1) {
                on.firstElementChild.innerText = res.info.nickname
                on.classList.add('active')
                off.classList.remove('active')
                // off.innerText = res.info.nickname;
            }
        }
    })
}
const logoutBtn = document.querySelector('.logout')
logoutBtn.addEventListener('click', () => {
    if (!window.confirm('您确认退出登录吗?')) return
    ajax({
        url: 'http://localhost:8888/users/logout',
        data: `id=${id}`,
        dataType: 'json',
        success(res) {
            if (res.code === 1) window.location.reload()
        }
    })
})

// 渲染
const listBox = document.querySelector('.main1')
const select = document.querySelector('select')

const listInfo = {
    current: 1,
    pagesize: 12,
    search: '',
    filter: '',
    saleType: 0,
    sortType: '',
    sortMethod: '',
    category: ''
  }
  
getGoodsList()
async function getGoodsList() {
  // 2-2-1. 把对象数据类型 listInfo 转换成一个 查询字符串
  let data = ''
  for (let key in listInfo) {
    if (listInfo[key]) data += key + '=' + listInfo[key] + '&'
  }
  data = data.slice(0, -1)

  // 2-2-2. 按照接口文档请求列表数据
  const res = await pAjax({
    url: 'http://localhost:8888/goods/list',
    data,
    dataType: 'json'
  })
  // console.log(res.list)
  const { list, total } = res

  // 2-2-3. 渲染页面
  let str = ''
  list.forEach(item => {
    str += `
    <div class="data " data-id="${ item.goods_id }">
    <div class="show"><img src="${ item.img_big_logo }" alt="" class="data_img" data-id="${ item.goods_id }"></div>
    <div class="info">${ item.title }</div>
    <div class="price">
        <span class="current">￥${ item.current_price }</span>
        <span class="old">☆${ item.price }</span>
    </div>
    <span class="tip ${ item.is_hot ? 'active' : '' }">HOT</span>
    <span class="tip ${ item.is_sale ? 'active' : '' }">SALE</span>
    <button data-id="${ item.goods_id }">直接购买</button>
    <a href="./list.html " target="_blank"><div class="huaguo"> 查找相似</div></a>
</div>
    `
  })
  listBox.innerHTML = str
}
// 点击列表详情
listBox.addEventListener('click', async e => {
  e = e || window.event
  const target = e.target || e.srcElement
  if (target.className === 'data_img') {
    const id = target.dataset.id
    window.sessionStorage.setItem('goods_id', id)
    window.location.href = './details.html'
  }
  if (target.tagName === 'BUTTON') {
    const id = window.localStorage.getItem('id')
    const token = window.localStorage.getItem('token')
    if (!id || !token) {
      const result = window.confirm('您还没有登录, 点击确定跳转到登录页, 点击取消稍后在购买 !')
      window.localStorage.setItem('url', 'list')
      if (result) window.location.href = './login.html'
      return
    }
    const goodsId = target.dataset.id
    const res = await pAjax({
      url: 'http://localhost:8888/cart/add',
      token,
      data: `id=${id}&goodsId=${goodsId}`,
      method: 'post',
      dataType: 'json'
    })
    if (res.code === 1) window.alert('加入购物车成功了')
  }
})